import React from 'react'
import {Tabs,Select,Table, Divider, Tag,Modal,Button,message} from 'antd';
import './index.less';
import axios from 'axios';
import {PATH,IP} from '../../../../utils/urls';
import {createHashHistory} from 'history';
import BreadcrumbCustom from "../../../../components/BreadcrumbCustom";
const { TabPane } = Tabs;
const { Option } = Select;

export default class WarnSetupSoftWare extends React.Component {
    columnsArray = [
        {
            title: 'id',
            dataIndex: 'key',
            key: 'key',
            render:(text)=>{
                let index = text+1;
                return <span>{index}</span>
            }
        },{
            title: 'AppId',
            dataIndex: 'id',
            key: 'id',
        },{
            title: '类型',
            dataIndex: 'resouceTypeName',
            key: 'resouceTypeName',
        },{
            title: '名称',
            dataIndex: 'resouceName',
            key: 'resouceName',
        },{
            title: '操作',
            key: 'tags',
            dataIndex: 'tags',
            render: (tags,data) => (
                <span>
            {tags.map((tag,index) => {
                return (
                    <span key={index}><a href="javascript:void(0);" onClick={this.actionClick.bind(this,{tag},{index},{data})}>{tag}</a></span>
                );
            })}
          </span>
            ),
        },
    ];
    constructor(props) {
        super(props);
        console.log(props.location);
        let appId = "";
        let name = "";
        let currentId = localStorage.getItem("softIdCurrent");
        if(props.location.state){
            appId = props.location.state.appId;
        }else if(currentId){
            appId = currentId;
        }
        if(props.location.state){
            name = props.location.state.name;
        }
        this.state = {
            tabsPostion:"1",//tabs选中索引
            hardWareArray:[],//硬件资源
            softWareArray:[],//软件资源
            hardWareId:appId,
            name:name
        };
    }

    componentDidMount() {
        //获取软件列表
        this.getSoftWareResource();
    }

    /**
     * 获取软件列表
     * @returns {*}
     */
    getSoftWareResource(){
        axios.post(PATH.softwareResource, {
            // hardwareId: this.state.hardWareId
        }).then(response => {
            console.log(response);
            if (response.data.code == 0) {
                let dataArray = response.data.data;
                console.log(response.data.data);
                for(let i = 0;i<dataArray.length;i++){
                    dataArray[i].key = i;
                    dataArray[i].name = this.state.name;
                    dataArray[i].tags = ["告警设置"];
                }
                console.log(dataArray);
                this.setState({
                    hardWareArray:dataArray
                })
            }
        })
    }

    /**
     * 点击操作功能
     * @returns {*}
     */
    actionClick = (props0,props1,props2) => {
        console.log(props0);
        console.log(props1);
        console.log(props2);
        let path = {
            state:{
                appId:props2.data.id,
                name:props2.data.resouceName,
                resouceType:props2.data.resouceType
            },
        }
        path.pathname='/serviceclientwarnsetup';
        this.props.history.push(path);
    }

    /**
     * 返回
     * @returns {*}
     */
    backFun=()=>{
        let path={
            pathname:"warnsetuphardware"
        }
        this.props.history.push(path);
    }
    render() {
        return (
            <div>
                <BreadcrumbCustom first="告警" second="告警设置" />
                <div className="resourceAddType">
                    <div className="resourceManagerTitle">
                        <span className="equipmentNoSelect" onClick={this.backFun}>设备资源管理</span>
                        <Divider type="vertical"/>
                        <span className="equipmentSelect">软件资源管理</span>
                    </div>
                </div>
                <Table className= "reasureManagerClass" columns={this.columnsArray} dataSource={this.state.hardWareArray} bordered />
            </div>
        )
    }
}